import React, { useEffect, useState, forwardRef, useImperativeHandle } from 'react';
import { connect } from 'umi';
import { Form, Button, Row, Col, Divider, Space, Tag } from 'antd';
import FormCondition from '@/components/FormCondition';
import { banner_type } from '@/common/contact'
const FormComponents = (props, ref) => {

    const [form] = Form.useForm();
    const { initialValues = {}, wxPageList = [], index } = props
    const [active, setActive] = useState('')
    useImperativeHandle(ref, () => ({
        form: form
    }));
    useEffect(() => {
        const { jumpType } = initialValues
        setActive(jumpType)
    }, [initialValues])
    const RenderForm = () => {
        if (active === 'none') {
            return []
        } else if (active === 'internal') {
            return []
        }
        else if (active === 'h5') {
            return [{
                label: `h5地址`,
                name: 'jumpUrl',
            }]
        }
        else if (active === 'external') {
            return [{
                label: `外部小程序地址`,
                name: 'jumpUrl',
            }, {
                label: `小程序appid`,
                name: 'params',
            }]
        }
        else if (active === 'videoAccount') {
            return [{
                label: `视频号id`,
                name: 'jumpUrl',
            },]
        }
        else if (active === 'customer') {
            return []
        }
        else if (active === 'videoLive') {
            return [{
                label: `视频号id`,
                name: 'jumpUrl',
            },]
        }
        else if (active === 'wxPage') {
            return [{
                label: `微页面`,
                name: 'jumpUrl',
                type: 'select',
                select: wxPageList,
                fieldNames: { label: 'pageName', value: 'id' },
            }]
        }
        return []
    }
    const formItems = [
        {
            label: `标题`,
            name: 'bannerName',
        },

        {
            label: `轮播图`,
            maxFile: 1,
            max: 1,
            name: 'cover',
            type: 'upload'
        },
        {
            label: `跳转类型`,
            name: 'jumpType',
            type: 'select',
            select: banner_type,
            onChange: (e) => {
                setActive(e)
                form.setFieldsValue({
                    jumpUrl: '',
                    params: ''
                })
            }
        },
        ...RenderForm(),
        {
            label: `权重`,
            name: 'weight',
            type: 'number'
        },
        {
            label: `状态`,
            name: 'status',
            type: 'select',
            select: {
                0: '下架',
                1: '上架'
            }
        },

    ];
    return <FormCondition form={form} formItems={formItems} initialValues={initialValues} ></FormCondition>
}
export default forwardRef(FormComponents)

